笔记

再一次，javascript设计模式与开发实践-享元模式

简述

一种优化性能的模式，享元的核心是运用共享技术来有效支持大量细粒度的对象。

假设服装工厂有50种款式的衣服，为了推销产品工厂决定请模特来穿服装拍摄，在现实中不会请50名模特来试穿，所以在程序中享元模式指的就是这种情况。

使用场景

  • 地图图钉
  • 标签页
  • ..

案例

假如我们在设计一个标签页功能，每个标签都需要载入iframe，没有必要每张标签都创建一个iframe元素，那么可以使用享元模式。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
var objPoolFactory = function (createObjFn) {
    var objPool = [];

    return {
        create : function () {
            return objPool.length ? objPool.shift() : createObjFn.apply(this, arguments);
        },
        recover: function (obj) {
            objPool.push(obj);
        }
    }
};

var iframeFactory = objPoolFactory(function() {
    var iframe = document.createElement('iframe');
    document.body.appendChild(iframe);

    iframe.onload = function() {
        iframe.onload = null;
        iframeFactory.recover(iframe);
    };

    return iframe;
});

var iframe1 = iframeFactory.create();
iframe1.src = 'http://baidu.com';

var iframe2 = iframeFactory.create();
iframe2.src = 'http://google.com';

setTimeout(function () {
    var iframe3 = iframeFactory.create();
    iframe3.src = 'http://baidu.com';
}, 3000);